<div class="user-center-head"><?php echo L('member_comment') ?></div>
<div class="clearfix">
    <iframe id="upload_target" name="upload_target" src="" style="width:0;heigth:0;overflow:hidden;border:0;position: absolute; left:-500px;"></iframe>
    <form action="<?php echo url('user/comment_photo_add');?>" class="uploldimg-form" method="post" enctype="multipart/form-data" target="upload_target">    
        <input type="hidden" name="uploadimg" value="1" />
        <input type="hidden" name="list" value="" />
        <input class="btn hide" type="file" name="img" />
    </form>
    <?php
    if (isset($orderInfo['productList']) && $orderInfo['productList']):
        foreach ($orderInfo['productList'] as $i => $product):
		    //是否评论过
			$comment_where = array(
				'order_items_id'=>$product['id'],
				'product_id'=>$product['product_id'],
			);
			$comment = M('comment')->where($comment_where)->find();
            ?>
            <?php if(!$comment):?>
            <form action="#" class="comment-form" method="post">
                <div class="comment-item clearfix">
                    <img class="pull-left comment-pd" src="<?php echo $product['small_img'];?>"/>
                    <ul class="comment-info">
                        <li>
                          <input type="hidden" name="comment[<?php echo $i;?>][product_id]" value="<?php echo $product['product_id']?>"/>
                          <em class="text"><?php echo L('user_comment_add_page_1')?></em>
                          <a target="_blank" href="<?php echo $product['url'];?>"><?php echo $product['name']?></a>
                        </li>
                        <li class="star-level">
                            <span><?php echo L('Rating');?> </span>
                            <span class="star able" pid="<?php echo $product['product_id']?>">
                                <span class="fa fa-star-o"></span>
                                <span class="fa fa-star-o"></span>
                                <span class="fa fa-star-o"></span>
                                <span class="fa fa-star-o"></span>
                                <span class="fa fa-star-o"></span>
                            </span>
                            <span class="star-desc"></span>
                            <input type="hidden" name="star" value="5" class="star_val" id="star_val_<?php echo $product['product_id']?>"/>
                            <input type="hidden" name="pid" value="<?php echo $product['product_id']?>"/>
                            <input type="hidden" name="oid" value="<?php echo $product['order_id']?>"/>
                            <input type="hidden" name="oitemsid" value="<?php echo $product['id']?>"/>
                            <input type="hidden" name="addimg" value="" id="addimg-<?php echo $i;?>"/>
                            <input type="hidden" name="delimg" value="" id="delimg-<?php echo $i;?>"/>
                        </li>
                        <li class="comment-desc">
                            <span class="comment-desc-title col-md-1"><?php echo L('user_comment_add_page_2')?></span>
                            <div class="comment-desc-info col-md-10">
                                <div class="textarea-wrap rel">
                                    <textarea placeholder="填写评论..." class="textarea" name="comment[<?php echo $i;?>][content]"></textarea>
                                    <span class="char-remain"><span class="num">1,000</span> <?php echo L('characters_remaining');?></span>
                                </div>
                                <div class="uploader">
                                    <a class="upload-img js-upload-img" data-list-id="<?php echo $i;?>">上传图片</a>
                                    <div class="comment-img">
<!--                                        <label>
                                        <img src="/data/comment/2015/03/26/551366528d553.jpg">
                                        <i class="fa fa-close" data-img-id="104" data-list-id="1"></i>
                                        </label>-->
                                        <span class="fa fa-plus add-img hide" data-list-id="<?php echo $i;?>" id="fa-plus-<?php echo $i;?>"></span>
                                    </div>
                                </div>
                                <div class="comment-tips">
                                    <span class="empty" hidden><?php echo L('Comments_cannot');?></span>
                                    <span class="limit" hidden><?php echo L('characters_least');?></span>
                                    <span class="review" hidden><?php echo L('under_review');?></span>
                                </div>
                                <input type="button" name="dosubmit" value="<?php echo L('submit_comment')?>" class="pull-right submitBtn btn">
                            </div>
                        </li>
                    </ul>
                </div>
            </form>
        <?php else:?>
            <?php $star_str = array(L('poor'),L('average'),L('good'),L('very_good'),L('excellent'));?>
            <div class="comment-item clearfix">
                <img class="pull-left comment-pd" src="<?php echo $product['small_img'];?>"/>
                <ul class="comment-info">
                    <li>
                        <label><?php echo L('user_comment_add_page_1')?></label> <a target="_blank" href="<?php echo $product['url'];?>"><?php echo $product['name']?></a>
                    </li>
                    <li class="star-level">
                        <label><?php echo L('Rating');?>:</label>
                        <span class="star">
							<?php for($star=0;$star<$comment['star'];$star++):?>
                                <span class="fa fa-star"></span>
                            <?php endfor;?>
                            <?php for($star=0;$star<(5-$comment['star']);$star++):?>
                                <span class="fa fa-star-o"></span>
                            <?php endfor;?>
                        </span>
                        <span class="star-desc"><?php echo $star_str[($comment['star']-1)];?></span>
                    </li>
                    <li class="comment-desc">
                        <span class="comment-desc-title col-md-1"><?php echo L('user_comment_add_page_2')?></span>
                        <div class="comment-desc-info col-md-10">
                            <div class="textarea text"><?php echo $comment['content'];?></div>
                            <div class="uploader">
                                <div class="comment-img">
                                    <?php $comment_photo = M('comment_photo')->field('img,thumb')->where(array('comid'=>$comment['id']))->order('fid asc')->select();?>
                                    <?php foreach($comment_photo as $photo):?>
                                        <label>
                                            <img src="<?php echo $photo['img'];?>">
                                        </label>
                                    <?php endforeach;?>
                                </div>
                            </div>
                            <div class="comment-tips">
                                <span class="review">
                                <?php if($comment['disabled']!=1):?>
                                    <?php echo L('under_review');?>
                                <?php endif;?>
                                </span>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        <?php endif;?>
        <?php
        endforeach;
    endif;
    ?>
    <input type="hidden" name="comment_token" value="<?php echo $comment_token; ?>"/>
</div>
<script>
    //图片显示
    function photoShow(list, id, img, thumb) {
        if (parseInt(id) > 0) {
            $('#addimg-' + list).val($('#addimg-' + list).val() + id + ',');
            var $thumbImg = $('<label><img src="' + img + '" /><i class="fa fa-close" data-list-id="' + list + '" data-img-id="' + id + '"></i></label>');
            var _self = $('#fa-plus-' + list);
            _self.removeClass("hide").before($thumbImg).closest(".uploader").find(".js-upload-img").hide();
            if(_self.parent().find("label").size() >= 5){
                _self.addClass("hide");
            }else{
                _self.removeClass("hide");
            }
        }
    }

    $(function () {

        /*选取评论星级*/
        var star_wrap = $(".star.able");
        $.each(star_wrap, function () {
            var _this = $(this);
            var star = _this.find("span");
            var pid = _this.attr("pid");
            var i = 0,
                iScore = 0,
                iStar = 5;
            var starMsg = ['<?php echo L('poor');?>', '<?php echo L('average');?>', '<?php echo L('good');?>', '<?php echo L('very_good');?>', '<?php echo L('excellent');?>'];
            $(this).siblings('.star-desc').text(starMsg[iStar - 1]);
            star.on("mouseover", function () {
                fnPoint($(this).index() + 1);
                var target = $(this).parent().siblings('.star-desc');
                target.text(starMsg[$(this).index()]);
                $(this).attr("title", starMsg[$(this).index()]);
            });
            star.on("mouseout", function () {
                var target = $(this).parent().siblings('.star-desc');
                target.text(starMsg[iStar - 1]);
                fnPoint();
            });
            star.on("click", function () {
                iStar = $(this).index() + 1;
                var target = $(this).parent().siblings('.star-desc,.star_val');
                target.text(starMsg[$(this).index()]);
                //$(this).parent().siblings('.star_val').val(starMsg[$(this).index()]);
            });
            //评分处理
            function fnPoint(iArg) {
                //分数赋值
                iScore = iArg || iStar;
                for (i = 0; i < star.length; i++) $(star)[i].className = i < iScore ? "fa fa-star" : "fa fa-star-o";
                $('#star_val_' + pid).val(iScore);
            };
            fnPoint();
        });

        /*操作评论textarea*/
        var minlimit = 10,
            maxlimit = 1000;
        $(".comment-desc").on("keydown keyup", "textarea", function () {
            var $this = $(this),
                $form = $this.closest(".comment-form");
            $form.find(".comment-tips").hide();
            $form.find(".submitBtn").attr("disabled", false);
            if ($this.val().length > maxlimit) {
                $this.val($this.val().substring(0, maxlimit));
            } else {
                $this.parent().find(".num").text(maxlimit - $this.val().length);
            }
        });

        /*提交评论*/
        $(".comment-form").on("click", ".submitBtn", function () {
            var $this = $(this).closest(".comment-form"),
                txArea = $this.find(".comment-desc textarea");
            if (!$.trim(txArea.val())) {
                $this.find(".comment-tips").show().find(".empty").show().siblings().hide();
                txArea.focus();
                return false;
            } else if (txArea.val().length < minlimit) {
                $this.find(".comment-tips").show().find(".limit").show().siblings().hide();
                txArea.focus();
                return false;
            }
            //评论提交
            $.ajax({
                type: 'POST',
                url: '/user/comment_add_ajax',
                data: {
                    'oid': $this.find("input[name*='oid']").val(),
                    'oitemsid': $this.find("input[name*='oitemsid']").val(),
                    'pid': $this.find("input[name*='pid']").val(),
                    'star': $this.find("input[name*='star']").val(),
                    'content': $this.find("textarea[name*='content']").val(),
                    'addimg': $this.find("input[name*='addimg']").val(),
                    'delimg': $this.find("input[name*='delimg']").val()
                },
                success: function (res) {
                    var res = eval('(' + res + ')');
                    if (res['error'] == 1) {
                        $this.find(".star").removeClass("able");
                        $this.find(".comment-tips").show().find(".review").show().siblings().hide();
                        var txAreaVal = txArea.val();
                        $this.find(".textarea-wrap").remove();
                        $this.find(".comment-desc-info").prepend('<div class="textarea">' + txAreaVal + '</div>');
                        $this.find(".submitBtn").hide().val("under review...").attr("disabled", true);
                        $this.find(".js-upload-img,.comment-img label i").remove();
                    } else {
                        alert(res['errStr']);
                    }

                }
            });
            return false;
        });

        /*上传图片*/
        $(".js-upload-img").on("click", function () {
            fileClick($(this));
        });

        /*评论图片处理*/
        $(".comment-img").on("click", "label i", function () {
            var _self = $(this);
            var list = _self.attr("data-list-id");
            var id = _self.attr("data-img-id");
            var addimg = $('#addimg-' + list).val();

            $('#delimg-' + list).val($('#delimg-' + list).val() + id + ',');

            addimg = addimg.substring(0, addimg.length - 1);
            var arr = addimg.split(',');
            $('#addimg-' + list).val('');
            for (var i = 0; i < arr.length; i++) {
                if (arr[i].indexOf(id) <= -1) {
                    var imgStr = $('#addimg-' + list).val() + arr[i] + ',';
                    $('#addimg-' + list).val(imgStr);
                }
            }

            _self.parent().hide(function () {
                var comment_img = _self.closest(".comment-img");
                _self.parent().remove();
                var _len = comment_img.find("label").size();
                var _btn = comment_img.siblings(".js-upload-img");
                if (!_len) {
                    comment_img.find(".add-img").addClass("hide");
                    _btn.show();
                }else{
                    comment_img.find(".add-img").removeClass("hide");
                }
            });
        });
        $(".comment-img").on("click", ".add-img", function () {
             fileClick($(this));
        });
        $("input[type='file']").on("change", function () {
            $(".uploldimg-form").submit();
        });
        function fileClick(obj) {
            $("input[name='list']").val($(obj).attr("data-list-id"));
            $("input[type='file']").trigger("click");
        }
    });
</script>
